﻿<div class="pmb-block">
  <div class="p-header">
    <ul class="p-menu">
      <li class="active"><a href=""><i class="zmdi zmdi-accounts-add hidden-xs"></i> Recommanded</a></li>
      <li><a href=""><i class="zmdi zmdi-accounts hidden-xs"></i> Connected</a></li>
      <li class="pm-search">
        <div class="pms-inner">
          <i class="zmdi zmdi-search"></i>
          <input type="text" placeholder="Search...">
        </div>
      </li>
    </ul>

    <ul class="actions m-t-20 hidden-xs">
      <li class="dropdown" dropdown>
        <a href="" dropdown-toggle>
          <i class="zmdi zmdi-more-vert"></i>
        </a>

        <ul class="dropdown-menu dropdown-menu-right">
          <li>
            <a href="">Refresh</a>
          </li>
          <li>
            <a href="">Settings</a>
          </li>
        </ul>
      </li>
    </ul>
  </div>

  <div class="contacts c-profile clearfix row">
    <div class="col-md-3 col-sm-6 col-xs-6">
      <div class="c-item">
        <a href="" class="ci-avatar">
          <img src="img/contacts/1.jpg" alt="">
        </a>

        <div class="c-info">
          <strong>Cathy Shelton</strong>
          <small>cathy.shelton31@example.com</small>
        </div>

        <div class="c-footer">
          <button class="waves-effect"><i class="zmdi zmdi-person-add"></i> Add</button>
        </div>
      </div>
    </div>

    <div class="col-md-3 col-sm-6 col-xs-6">
      <div class="c-item">
        <a href="" class="ci-avatar">
          <img src="img/contacts/2.jpg" alt="">
        </a>

        <div class="c-info">
          <strong>Stella Flores</strong>
          <small>stella@example.com</small>
        </div>

        <div class="c-footer">
          <button class="waves-effect"><i class="zmdi zmdi-person-add"></i> Add</button>
        </div>
      </div>
    </div>

    <div class="col-md-3 col-sm-6 col-xs-6">
      <div class="c-item">
        <a href="" class="ci-avatar">
          <img src="img/contacts/3.jpg" alt="">
        </a>

        <div class="c-info">
          <strong>Marilyn Thomas</strong>
          <small>marilyn@example.com</small>
        </div>

        <div class="c-footer">
          <button class="waves-effect"><i class="zmdi zmdi-person-add"></i> Add</button>
        </div>
      </div>
    </div>

    <div class="col-md-3 col-sm-6 col-xs-6">
      <div class="c-item">
        <a href="" class="ci-avatar">
          <img src="img/contacts/4.jpg" alt="">
        </a>

        <div class="c-info">
          <strong>Dwight Gilbert</strong>
          <small>dwight@example.com</small>
        </div>

        <div class="c-footer">
          <button class="waves-effect"><i class="zmdi zmdi-person-add"></i> Add</button>
        </div>
      </div>
    </div>

    <div class="col-md-3 col-sm-6 col-xs-6">
      <div class="c-item">
        <a href="" class="ci-avatar">
          <img src="img/contacts/5.jpg" alt="">
        </a>

        <div class="c-info">
          <strong>Cody Moreno</strong>
          <small>moreno@example.com</small>
        </div>

        <div class="c-footer">
          <button class="waves-effect"><i class="zmdi zmdi-person-add"></i> Add</button>
        </div>
      </div>
    </div>

    <div class="col-md-3 col-sm-6 col-xs-6">
      <div class="c-item">
        <a href="" class="ci-avatar">
          <img src="img/contacts/6.jpg" alt="">
        </a>

        <div class="c-info">
          <strong>Jamie Freeman</strong>
          <small>freeman@example.com</small>
        </div>

        <div class="c-footer">
          <button class="waves-effect"><i class="zmdi zmdi-person-add"></i> Add</button>
        </div>
      </div>
    </div>

    <div class="col-md-3 col-sm-6 col-xs-6">
      <div class="c-item">
        <a href="" class="ci-avatar">
          <img src="img/contacts/7.jpg" alt="">
        </a>

        <div class="c-info">
          <strong>Charles Spencer</strong>
          <small>charles@example.com</small>
        </div>

        <div class="c-footer">
          <button class="waves-effect"><i class="zmdi zmdi-person-add"></i> Add</button>
        </div>
      </div>
    </div>

    <div class="col-md-3 col-sm-6 col-xs-6">
      <div class="c-item">
        <a href="" class="ci-avatar">
          <img src="img/contacts/8.jpg" alt="">
        </a>

        <div class="c-info">
          <strong>Vickie Reed</strong>
          <small>reed@example.com</small>
        </div>

        <div class="c-footer">
          <button class="waves-effect"><i class="zmdi zmdi-person-add"></i> Add</button>
        </div>
      </div>
    </div>

    <div class="col-md-3 col-sm-6 col-xs-6">
      <div class="c-item">
        <a href="" class="ci-avatar">
          <img src="img/contacts/9.jpg" alt="">
        </a>

        <div class="c-info">
          <strong>Lauren Ruiz</strong>
          <small>ruiz@example.com</small>
        </div>

        <div class="c-footer">
          <button class="waves-effect"><i class="zmdi zmdi-person-add"></i> Add</button>
        </div>
      </div>
    </div>

    <div class="col-md-3 col-sm-6 col-xs-6">
      <div class="c-item">
        <a href="" class="ci-avatar">
          <img src="img/contacts/10.jpg" alt="">
        </a>

        <div class="c-info">
          <strong>Marlene Vasquez</strong>
          <small>vasquez@example.com</small>
        </div>

        <div class="c-footer">
          <button class="waves-effect"><i class="zmdi zmdi-person-add"></i> Add</button>
        </div>
      </div>
    </div>

    <div class="col-md-3 col-sm-6 col-xs-6">
      <div class="c-item">
        <a href="" class="ci-avatar">
          <img src="img/contacts/11.jpg" alt="">
        </a>

        <div class="c-info">
          <strong>Loretta Morrisonz</strong>
          <small>morrisonz@example.com</small>
        </div>

        <div class="c-footer">
          <button class="waves-effect"><i class="zmdi zmdi-person-add"></i> Add</button>
        </div>
      </div>
    </div>

    <div class="col-md-3 col-sm-6 col-xs-6">
      <div class="c-item">
        <a href="" class="ci-avatar">
          <img src="img/contacts/12.jpg" alt="">
        </a>

        <div class="c-info">
          <strong>Yvonne Wood</strong>
          <small>wood@example.com</small>
        </div>

        <div class="c-footer">
          <button class="waves-effect"><i class="zmdi zmdi-person-add"></i> Add</button>
        </div>
      </div>
    </div>

    <div class="col-md-3 col-sm-6 col-xs-6">
      <div class="c-item">
        <a href="" class="ci-avatar">
          <img src="img/contacts/13.jpg" alt="">
        </a>

        <div class="c-info">
          <strong>Denise Franklin</strong>
          <small>franklin@example.com</small>
        </div>

        <div class="c-footer">
          <button class="waves-effect"><i class="zmdi zmdi-person-add"></i> Add</button>
        </div>
      </div>
    </div>

    <div class="col-md-3 col-sm-6 col-xs-6">
      <div class="c-item">
        <a href="" class="ci-avatar">
          <img src="img/contacts/14.jpg" alt="">
        </a>

        <div class="c-info">
          <strong>Joseph Gonzalez</strong>
          <small>gonzalez@example.com</small>
        </div>

        <div class="c-footer">
          <button class="waves-effect"><i class="zmdi zmdi-person-add"></i> Add</button>
        </div>
      </div>
    </div>

    <div class="col-md-3 col-sm-6 col-xs-6">
      <div class="c-item">
        <a href="" class="ci-avatar">
          <img src="img/contacts/15.jpg" alt="">
        </a>

        <div class="c-info">
          <strong>Rick Graham</strong>
          <small>graham@example.com</small>
        </div>

        <div class="c-footer">
          <button class="waves-effect"><i class="zmdi zmdi-person-add"></i> Add</button>
        </div>
      </div>
    </div>

    <div class="col-md-3 col-sm-6 col-xs-6">
      <div class="c-item">
        <a href="" class="ci-avatar">
          <img src="img/contacts/16.jpg" alt="">
        </a>

        <div class="c-info">
          <strong>Alexander Bailey</strong>
          <small>bailey@example.com</small>
        </div>

        <div class="c-footer">
          <button class="waves-effect"><i class="zmdi zmdi-person-add"></i> Add</button>
        </div>
      </div>
    </div>
  </div>

  <div class="load-more">
    <a href=""><i class="zmdi zmdi-refresh-alt"></i> Load More...</a>
  </div>
</div>
